<template>
  <el-cascader v-if="tree.length > 0" ref="cascaderRef" v-model="selectVal" placeholder="请选择渠道" :options="tree"
               :props="{
    label: 'title',
    value: 'id',
    emitPath: false,
    checkStrictly: checkStrictly,
    multiple: multiple
    }" clearable @change="changeEvt" filterable
  ></el-cascader>
</template>

<script>
import {
  getTreeApi
} from '@/api/system/dictionary/source'

export default {
  name: 'SourcePickerView',
  data() {
    return {
      tree: [],
      selectVal: ''
    }
  },
  props: {
    value: {
      type: [Array, String, Number],
      default: function() {
        if (this.multiple) {
          return []
        } else {
          return ''
        }
      }
    },
    type: {
      type: String,
      default: ''
    },
    placeholder: {
      type: String,
      default: '请选择'
    },
    multiple: false,
    checkStrictly: false
  },
  watch: {
    value: {
      immediate: true,
      handler(val) {
        this.selectVal = val;

      }
    }
  },
  created() {
    getTreeApi({}).then((res) => {
      this.tree = res.data.tree;
    })
  },
  methods: {
    changeEvt() {
      this.$emit('input', this.selectVal)
    },
    clearCascader() {
      this.$nextTick(() => {
        this.selectVal = ''
      })
    }
  }
}
</script>
